<template>
  <el-form label-width="100px">
    <el-form-item label="计划类型：">
      <span>{{ mdl.planType === 1 ? '区域' : '部门' }}</span>
    </el-form-item>
    <el-form-item label="计划日期：">
      <span>{{mdl.beginDate}}至{{ mdl.endDate }}</span>
    </el-form-item>
    <el-form-item label="计划状态：">
      <span>
        <el-button :type="mdl.planState | judgeType" size="mini">{{ mdl.planState | judgeState }}</el-button>
      </span>
    </el-form-item>
    <el-form-item label="当前进度：">
      <span>
        <el-progress
          style="margin-top: 6px"
          :percentage="mdl.schedule ? Math.floor(mdl.schedule) : 0"
          :text-inside="true"
          color="#52c41a"
          :stroke-width="20"
        />
      </span>
    </el-form-item>
    <el-form-item label="创建人：">
      <span>{{ mdl.createUser }}</span>
    </el-form-item>
    <el-form-item label="创建时间：">
      <span>{{ formatTime(mdl.createTime) }}</span>
    </el-form-item>
  </el-form>
</template>

<script>
import { formatY } from '@/utils/util'
export default {
  data() {
    return {
      mdl: {}
    }
  },
  filters: {
    judgeState(num) {
      let str = ''
      switch (num) {
        case 0:
          str = '正常'
          break
        case 1:
          str = '结束'
          break
        case 2:
          str = '过期'
          break
        case 3:
          str = '作废'
          break
        default:
          break
      }
      return str
    },
    judgeType(num) {
      let str = ''
      switch (num) {
        case 0:
          str = 'success'
          break
        case 1:
          str = ''
          break
        case 2:
          str = 'warning'
          break
        case 3:
          str = 'danger'
          break
        default:
          break
      }
      return str
    }
  },
  methods: {
    edit(row) {
      console.log('form row', row)
      this.mdl = row
    }
  }
}
</script>

<style>
</style>